<template>
  <h1>Hello Vue3 - ref</h1>
  <h2>{{ number }}</h2>
  <button @click="btn">改数据</button>
</template>

<script>
import { ref } from 'vue'
export default {
  setup() {
    // 通常是用来定义普通类型数据，字符串，数字，布尔，null，undefined
    const number = ref(1000)

    console.log(number) // Ref 响应式对象
    console.log(number.value) // 需要通过 .value 获取真正的值

    const btn = () => {
      number.value++
    }

    return { btn, number }
  },
}
</script>

<style></style>
